<!DOCTYPE html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>学会详情</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/common.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui-pull-refresh.css" />

    <style>
        html,
        body {
            width: 100%;
            min-height: 100%;
            background: #fff;
        }

        .h20 {
            height: 0.5rem;
            background: #f0f0f0;
        }

        .xsTab {
            position: relative;
            z-index: 99
        }

        .xsTab .aui-tab-item {
            border: none;
            position: relative;
            color: #999;
        }

        .xsTab .aui-tab-item:after {
            content: '';
            display: block;
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            width: 50%;
            height: 2px;
            background: #fff;
            margin: auto;
        }

        .xsTab .aui-tab-item.aui-active {
            color: #2997e4;
        }

        .xsTab .aui-tab-item.aui-active:after {
            background: #2997e4;
        }

        .cxContent>div {
            display: none;
        }

        .xhjj {
            padding: 0.75rem;
            padding-bottom: 2.75rem;
        }

        .xhjj p {
            text-indent: 2em;
            font-size: 0.75rem;
            line-height: 1rem;
            margin-bottom: 0.5rem;
            color: #333;
        }

        .xhjj h5 {
            font-size: 0.75rem;
            margin-bottom: 0.5rem;
            color: #333;
        }

        .xhjj h6 {
            font-size: 0.75rem;
            margin-bottom: 1.5rem;
            text-align: right;
            color: #333;
        }

        .xhJoin {
            position: fixed;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 2rem;
            line-height: 2rem;
            color: #fff;
            font-size: 0.75rem;
            text-align: center;
            background-color: #2997e4;
        }
        /* 数据 */

        .enshrine .aui-list-item-title {
            color: #333;
            line-height: 1rem;
            font-size: 0.75rem;
        }

        .enshrine .aui-info-item {
            color: #999;
            font-size: 0.6rem;
        }

        .enshrine .aui-list-item-media {
            width: 6.5rem;
        }

        .aui-list .registration_txtBot {
            color: #2997e4;
            font-size: 0.6rem;
        }

        .hdxx .aui-media-list .aui-list-item-inner {
            display: -webkit-box;
            display: -webkit-flex;
            display: flex;
            -webkit-box-orient: vertical;
            box-orient: vertical;
            -webkit-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            justify-content: space-between;
            -webkit-box-align: start;
            -webkit-align-items: flex-start;
            align-items: flex-start;
        }

        .zy {
            color: #999;
            font-size: 0.6rem;
        }

        .cyxx .aui-list-item-media {
            width: 4rem;
        }

        .itemHIco {
            width: 3.25rem;
            height: 3.25rem;
            border-radius: 50%;
        }

        .itemIco {
            width: 100%;
            height: 4rem;
        }

        .xhjj {
            border-top: 0.5rem solid #f0f0f0;
        }
        #xsTab {
          position: fixed;
          width: 100%;
          top:0;
        }
        #cxContent {
          /*margin-top: 44px;*/padding-top: 44px;
        }
        .hdxxBox .aui-list-item .aui-info-item span {
          color: #ffb451;
          float: right;
        }
        .xhList ,.enshrine {
          min-height: calc(100vh - 109px)
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <div class="aui-tab xsTab" id="xsTab">
            <div class="aui-tab-item aui-active">学会简介</div>
            <div class="aui-tab-item" @click="open_xl2()">活动信息</div>
            <div class="aui-tab-item" @click="open_xl1()">会员信息</div>
        </div>

        <div class="cxContent" id="cxContent">
            <div class="xsBox xhjj" style="display: block;">
                <div v-html="info.content"></div>
                <div class="xhJoin" v-if="xhjjIsApply == 0 || xhjjStatus == 1 && xhjjStatus == 0" @click="openDetail('sqrh', '申请入会', info.id)">
                    {{xhjjText}}
                </div>
                <div class="xhJoin" v-else-if="xhjjStatus == 0" @click="quitXH(info.id)">
                    {{xhjjText}}
                </div>
                <div class="xhJoin" v-else>
                    {{xhjjText}}
                </div>
            </div>
            <div class="xsBox hdxx">
                <section class="aui-refresh-content hdxxBox">
                    <!-- <div class="aui-content"> -->
                    <div class="h20"></div>
                    <div class="aui-content aui-margin-b-15 enshrine">
                        <ul class="aui-list aui-media-list" v-if="newsList.length > 0">
                            <li class="aui-list-item" tapmode="presshover" @click="openNewWindow('activitydetails','活动详情', item.id)" v-for="item in newsList">
                                <div class="aui-media-list-item-inner">
                                    <div class="aui-list-item-media">
                                        <!-- <img :src="item.images"> -->
                                        <div v-if="item.images" class="itemIco" :style="'background: url('+ item.images +') center/cover no-repeat'"></div>
                                        <div v-else class="itemIco" style="background: url(../../image/wdr@3x.png) center/cover no-repeat"></div>
                                    </div>
                                    <div class="aui-list-item-inner">
                                        <div class="aui-list-item-text">
                                            <div class="aui-list-item-title">{{item.title}}</div>
                                        </div>
                                        <div class="aui-margin-t-5" style="width: 100%">
                                            <div class="aui-info-item" style="font-size: 0.6rem;position:relative">{{item.apply_date}}<span style="position:absolute;right: 0;top:0">{{item.applyCount}}人已报名</span></div>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                        <h3 v-else style="min-height:calc(100vh - 109px);font-size: 1rem;text-align: center;color: #999">暂无数据</h3>
                    </div>

                    <!-- </div> -->
                </section>
            </div>
            <div class="xsBox cyxx">
                <section class="aui-refresh-content cyxxBox">
                    <!-- <div class="aui-content"> -->
                    <div class="h20"></div>
                    <div class="aui-content aui-margin-b-15 xhList">
                        <ul class="aui-list aui-media-list">
                            <li class="aui-list-item aui-list-item-middle" tapmode="presshover" @click="openNewWindow('detailsinformation','详情资料', item.userid)" v-for="item in newsList2">
                                <div class="aui-media-list-item-inner">
                                    <div class="aui-list-item-media">
                                        <!-- <img :src="item.head_img" class="aui-img-round aui-list-img-sm">  -->
                                        <div v-if="item.head_img" class="itemHIco aui-img-round aui-list-img-sm" :style="'background: url('+ item.head_img +') center/cover no-repeat'"></div>
                                        <div v-else class="itemHIco aui-img-round aui-list-img-sm" style="background: url(../../image/wdr@3x.png) center/cover no-repeat"></div>
                                    </div>
                                    <div class="aui-list-item-inner">
                                        <div class="aui-list-item-title aui-font-size-14">{{item.nickname}}</div>
                                        <div class="zy">{{item.profession}}</div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>

                    <!-- </div> -->
                </section>
            </div>
        </div>
    </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/vue.min.js"></script>
<script type="text/javascript" src="../../script/aui-scroll.js"></script>
<script type="text/javascript" src="../../script/utils.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script src="../../script/aui-pull-refresh.js"></script>
<script src="../../script/aui-tab.js"></script>
<script type="text/javascript">
    apiready = function() {
        var app = new Vue({
            el: '#app',
            data: {
                id: 0,
                info: '',
                newsList: [],
                newsList2: [],
                page: 1,
                totalpage: 1,
                page2: 1,
                totalpage2: 1,
                token: $api.getStorage('token'),
                xhjjText: '',
                xhjjStatus: 0,
                xhjjIsApply: 0
            },
            created: function() {
                var $_this = this;
                if(!$api.getStorage('token')){
                  api.confirm( {
                      title: '是否登录',
                      msg: '确认是否登录？',
                      buttons: [ '确定', '取消' ]
                    }, function ( ret, err ) {
                      var index = ret.buttonIndex;
                      if ( index == 1 ) {
                        api.openWin({
                          name: 'login',
                          url: '../five_frame/login_header.html',
                          delay: 200,
                          bounces: false
                        });
                        return;
                      } else {
                        api.closeWin({
                            name: name
                        });
                        return
                      }
                    })
                    return
                  }
                $_this.id = api.pageParam.id
                api.ajax({
                    url: window.Url.getGroupDetail + $_this.id,
                    timeout: 300,
                    headers: {
                        'baseParams': $_this.token //token
                    },
                }, function(ret, err) {
                    if (ret) {
                        // api.alert({ msg: JSON.stringify(ret) });
                        if (ret.code == 2) {
                  // alert('用户未登录，请返回登录')
                  $api.rmStorage('token')
                  $api.rmStorage('data')
                  goback()
                   return
                }
                        $_this.info = ret.data

                    } else {
                        api.alert({
                            msg: JSON.stringify(err)
                        });
                    }
                })
                $_this.isApply()
                api.ajax({
                    url: window.Url.getActivity + $_this.id + '/' + $_this.page,
                    timeout: 300,
                }, function(ret, err) {
                    if (ret) {
                        // api.alert({ msg: JSON.stringify(ret) });
                        // console.log(window.Url.getActivity + $_this.id + '/' + $_this.page)
                        if (ret.code == 1) {
                            return
                        }
                        $_this.newsList = ret.data.newsList

                    } else {
                        api.alert({
                            msg: JSON.stringify(err)
                        });
                    }
                })
                var scroll = new auiScroll({
                    listen: true, //是否监听滚动高度，开启后将实时返回滚动高度
                    distance: 40 //判断到达底部的距离，isToBottom为true
                }, function(ret) {
                    if (ret.isToBottom) {
                        $_this.page++
                            if ($_this.page > $_this.totalpage) {
                                $_this.page = $_this.totalpage
                                return
                            }
                        api.ajax({
                            url: window.Url.getActivity + $_this.id + '/' + $_this.page,
                            timeout: 300,
                        }, function(ret, err) {
                            if (ret) {
                                if (ret.code == 1) {
                                    return
                                }
                                // api.alert({ msg: JSON.stringify(ret) });
                                $_this.newsList = $_this.newsList.concat(ret.data.newsList)

                            } else {
                                api.alert({
                                    msg: JSON.stringify(err)
                                });
                            }
                        })
                    }
                });
                api.ajax({
                    url: window.Url.getAllGroupUser,
                    timeout: 300,
                    method: 'post',
                    headers: {
                        'Content-Type': 'application/json',
                    },
                    data: {
                        body: {
                            page: $_this.page2,
                            newsId: $_this.id,
                        }
                    }
                }, function(ret, err) {
                    if (ret) {
                        if (ret.code == 1) {
                            return
                        }
                        // api.alert({ msg: JSON.stringify(ret) });
                        $_this.newsList2 = ret.data.newsList
                    } else {
                        api.alert({
                            msg: JSON.stringify(err)
                        });
                    }
                })
                var scroll = new auiScroll({
                    listen: true, //是否监听滚动高度，开启后将实时返回滚动高度
                    distance: 40 //判断到达底部的距离，isToBottom为true
                }, function(ret) {
                    if (ret.isToBottom) {
                        $_this.page2++
                            if ($_this.page2 > $_this.totalpage2) {
                                $_this.page2 = $_this.totalpage2
                                return
                            }
                        api.ajax({
                            url: window.Url.getAllGroupUser,
                            timeout: 300,
                            method: 'post',
                            headers: {
                                'Content-Type': 'application/json',
                            },
                            data: {
                                body: {
                                    page: $_this.page2,
                                    newsId: $_this.id,
                                }
                            }
                        }, function(ret, err) {
                            if (ret) {
                                if (ret.code == 1) {
                                    return
                                }
                                // api.alert({ msg: JSON.stringify(ret) });
                                $_this.newsList2 = $_this.newsList2.concat(ret.data.newsList)

                            } else {
                                api.alert({
                                    msg: JSON.stringify(err)
                                });
                            }
                        })
                    }
                });
            },
            methods: {
                openDetail: function(type, title, id) {
                    api.openWin({
                        name: 'index_detail_' + type,
                        pageParam: {
                            name: 'index_detail_' + type,
                            title: title,
                            id: id,
                            backName: api.pageParam.name
                        },
                        url: './first_header.html',
                        delay: 200,
                        bounces: false
                    });
                },
                openNewWindow: function(type, title, id) {
                    api.openWin({
                        name: type,
                        url: './' + type + '.html',
                        pageParam: {
                            name: type,
                            title: title,
                            id: id
                        },
                        bounces: false,
                        delay: 200
                    });
                },
                isApply: function() {
                    var $_this = this;
                    api.ajax({
                        url: window.Url.isApplyGroup + $_this.id,
                        timeout: 300,
                        headers: {
                            'baseParams': $api.getStorage('token') //token
                        },
                    }, function(ret, err) {
                        if (ret) {
                //           if (ret.code == 2) {
                //   alert('用户未登录，请返回登录')
                //   $api.rmStorage('token')
                //   $api.rmStorage('data')
                //   goback()
                //    return
                // }
                            // api.alert({ msg: JSON.stringify(ret) });
                            // 0-审核通过 1-审核不通过 2-未审核
                            $_this.xhjjIsApply = ret.data.isapply
                            $_this.xhjjStatus = ret.data.audit_status

                            if ($_this.xhjjStatus == 0) {
                              if ($_this.xhjjIsApply == 1) {
                                $_this.xhjjText = '退出学会'
                              } else {
                                $_this.xhjjText = '申请入会'
                              }

                            } else if ($_this.xhjjStatus == 1) {
                              $_this.xhjjText = '审核被拒，重新申请'
                            } else if ($_this.xhjjStatus == 2) {
                              if ($_this.xhjjIsApply == 1) {
                                $_this.xhjjText = '审核中'
                              } else {
                                $_this.xhjjText = '申请入会'
                              }
                            }
                            // alert($_this.xhjjText)
                        } else {
                            api.alert({
                                msg: JSON.stringify(err)
                            });
                        }
                    })
                },
                quitXH: function() {
                    var $_this = this;
                    api.confirm( {
                      title: '退出学会',
                      msg: '确认退出学会？',
                      buttons: [ '确定', '取消' ]
                    }, function ( ret, err ) {
                      var index = ret.buttonIndex;
                      if ( index == 1 ) {
                        api.ajax({
                            url: window.Url.educationalsociety + $_this.id,
                            timeout: 300,
                            headers: {
                                'baseParams': $api.getStorage('token') //token
                            },
                        }, function(r, e) {
                            if (r) {
                                if (r.code == 0) {
                                    $_this.isApply()
                                      api.toast({ msg: '退出学会成功',duration: 2000,location:'middle' });
                                } else {
                                  api.toast({ msg: r.message,duration: 2000,location:'middle' });
                                }


                            } else {
                                api.alert({
                                    msg: JSON.stringify(err)
                                });
                            }
                        })
                      }
                    })
                },
                open_xl1: function() {
                    var $_this = this

                        var pullRefreshCyxx = new auiPullToRefresh({
                            container: document.querySelector('.cyxxBox'),
                            triggerDistance: 100
                        }, function(ret) {
                            if (ret.status == "success") {
                              $_this.page2 = 1;
                                api.ajax({
                                    url: window.Url.getAllGroupUser,
                                    timeout: 300,
                                    method: 'post',
                                    headers: {
                                        'Content-Type': 'application/json',
                                    },
                                    data: {
                                        body: {
                                            page: $_this.page2,
                                            newsId: $_this.id,
                                        }
                                    }
                                }, function(ret, err) {
                                    if (ret) {
                                        // api.alert({ msg: JSON.stringify(ret) });
                                        setTimeout(function() {
                                            if (ret.code == 1) {
                                                return
                                                pullRefreshCyxx.cancelLoading(); //刷新成功后调用此方法隐藏
                                            }
                                            $_this.newsList2 = ret.data.newsList
                                            pullRefreshCyxx.cancelLoading(); //刷新成功后调用此方法隐藏
                                        }, 500)
                                    } else {
                                        api.alert({
                                            msg: JSON.stringify(err)
                                        });
                                    }
                                })
                            }
                        })
                },
                open_xl2: function() {
                    var $_this = this

                        var pullRefreshHdxx = new auiPullToRefresh({
                            container: document.querySelector('.hdxxBox'),
                            triggerDistance: 100
                        }, function(ret) {
                            if (ret.status == "success") {
                              $_this.page = 1;
                                api.ajax({
                                    url: window.Url.getActivity + $_this.id + '/' + $_this.page,
                                    timeout: 300,
                                }, function(ret, err) {
                                    if (ret) {
                                        // api.alert({ msg: JSON.stringify(ret) });
                                        // console.log(window.Url.getActivity + $_this.id + '/' + $_this.page)
                                        setTimeout(function() {
                                            if (ret.code == 1) {
                                                pullRefreshHdxx.cancelLoading(); //刷新成功后调用此方法隐藏
                                                return
                                            }
                                            $_this.newsList = ret.data.newsList
                                            pullRefreshHdxx.cancelLoading(); //刷新成功后调用此方法隐藏
                                        }, 500)
                                    } else {
                                        api.alert({
                                            msg: JSON.stringify(err)
                                        });
                                    }
                                })
                            }

                        })
                }
            },
            mounted: function() {
                var tab = new auiTab({
                    element: document.getElementById("xsTab"),
                    index: 1,
                    repeatClick: false
                }, function(ret) {
                    var xsBox = document.querySelectorAll('.xsBox')
                    for (var i = 0; i < xsBox.length; i++) {
                        xsBox[i].style.display = 'none'
                    }
                    document.querySelectorAll('.xsBox')[ret.index - 1].style.display = 'block'
                })


            }
        })
    }

    function reData () {
      app.$data.xhjjIsApply = 0
      app.$data.xhjjStatus = 1
      app.$data.xhjjText = '审核中'
    }
    function goback() {
        api.closeWin({
            name: api.pageParam.name
        });
    }
</script>

</html>
